﻿<%@ Page Title="店铺补货限制" Language="C#" MasterPageFile="~/master/m.master" %>

<script runat="server"></script>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
    <link href="../assets/css/plugins/footable/footable.core.css" rel="stylesheet">
    <link href="../assets/css/shelf/base.css" rel="stylesheet">
    <link href="../assets/css/plugins/webuploader/webuploader.css" rel="stylesheet" />
    <link href="../assets/img/validate/validate.css" rel="stylesheet">
    <link href="../assets/css/plugins/iCheck/customsmall.css" rel="stylesheet" />
    <link href="../assets/css/plugins/stepper/stepper.widget.css" rel="stylesheet" />
    <link href="../assets/css/plugins/boxdrop/boxDrop.css" rel="stylesheet" />
    <link href="../assets/js/plugins/bootstrap-duallistbox/bootstrap-duallistbox.min.css" rel="stylesheet" />

    <style type="text/css">
        .system-box .right-side {
            width: 98%;
        }

        .condition, .condition-title {
            border-bottom: 1px solid #dfdfdd;
        }

        .form-group label {
            max-width: 70px;
            margin-left: 5px;
            padding-left: 1px;
            padding-right: 1px;
        }

        #query-condition {
            margin: 8px;
        }

        #query-condition .row {
            margin-bottom: 4px;
        }

        #query-condition .form-control {
            padding: 2px 6px;
            height: 28px;
        }

        .no-padding-lb {
            padding-right: 0px;
            padding-left: 0px;
        }

        .no-padding-lb label {
            padding: 0px;
            font-size: 12px;
            margin: 1px 0px;
        }

        .no-padding-in {
            padding-right: 0px;
            padding-left: 0px;
        }

        .suggest-but {
            padding: 0px 4px;
        }

        .ShopName {
            text-align: left;
        }

        @media (min-width: 750px) {
            .modal-dialog {
                width: 750px;
            }

            .footable {
                border-bottom: 1px solid #dfdfdd;
                border-left: 1px solid #dfdfdd;
            }

            .footable th,
            .footable td {
                border-top: 1px solid #dfdfdd;
                border-right: 1px solid #dfdfdd;
                text-align: center;
            }

            .tb-head-container {
                padding-right: 6px;
                background: #fff;
            }

            .tb-body-container {
                overflow-x: hidden;
                padding-right: 0px;
                background: #fff;
            }
            /*所有表格行高缩小*/
            .ibox-content .table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
                padding: 1px !important;
            }
        }
    </style>

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="main" runat="Server">
    <div class="system-box">
        <div class="right-side">
            <%-- 按钮--%>
            <div class="btns-container"></div>
            <%--修改弹出框begin--%>
            <div class="modal inmodal" id="addWindow" tabindex="-1" role="dialog" aria-hidden="true">
                <div class="modal-dialog">
                    <div class="modal-content animated bounceInRight">
                        <div class="modal-header">
                            <span class="editTitle"></span>
                            <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span> <span class="sr-only">关闭</span> </button>
                        </div>
                        <div id="message" style="display: none"></div>
                        <div class="modal-body clearfix">
                            <form class="form-edit">
                                <div id="query-condition">
                                    <div class="row">
                                        <div class="form-group">
                                            <div class="col-sm-2 text-right">
                                                <label>货号:</label>
                                            </div>
                                            <div class="col-sm-9 no-padding-in">
                                                <input type="text" id="MaterialID" name="MaterialID" placeholder="" class="form-control required" />
                                                <input type="text" id="OldMaterialID" name="OldMaterialID" class="hide" />
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="form-group">
                                            <div class="col-sm-2">
                                            </div>
                                            <div class="col-sm-10 no-padding-in">
                                                <input type="checkbox" id="AllShopFlag" name="AllShopFlag" />
                                                <input type="text" id="OldAllShopFlag" name="OldAllShopFlag" class="hide" />
                                                所有店铺限制补货
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="form-group">
                                            <div class="col-sm-2 text-right">
                                                <label>店铺设置:</label>
                                            </div>
                                            <div class="col-sm-9">
                                                <div class="row">
                                                    <div class="col-sm-7 no-padding-in">
                                                        <div class="col-sm-5 no-padding-in">
                                                            <select class="form-control input-sm" id="serarch-province">
                                                                <option value="">请选择省份</option>
                                                            </select>
                                                        </div>
                                                        <div class="col-sm-5 no-padding-in" style="padding-right: 8px;">
                                                            <select class="form-control input-sm" id="serarch-city">
                                                                <option value="">请选择城市</option>
                                                            </select>
                                                        </div>
                                                    </div>

                                                </div>
                                                <div class="row">
                                                    <select multiple="multiple" name="duallistbox_shop" class="select_shop">
                                                    </select>
                                                    <input class="hide" id="Oldselect_shop" type="text" />
                                                </div>

                                            </div>
                                        </div>
                                    </div>

                                </div>
                            </form>
                        </div>
                        <div class="modal-footer">
                            <button type="button" id="addModuleBtn" class="btn btn-primary">保存</button>
                            <button type="button" id="closeAddBox" class="btn btn-white" data-dismiss="modal">关闭</button>
                        </div>
                    </div>
                </div>
            </div>
            <%--修改弹出框end--%>
            <div class="condition clearfix">
                <label>店铺&nbsp;&nbsp;</label>
                <input type="text" placeholder="店铺名称或编号" id="search-store" data-value="" class="form-control input-w170 input-sm" />
                <label>货号</label>
                <input id="search_materialID" class="form-control input-w170 input-sm" placeholder="货号" />
            </div>

            <div class="right-content-box clearfix">
                <div class="ibox-content">
                    <table class="footable table table-stripped" id="tableList">
                        <thead></thead>
                        <tbody id="pageList"></tbody>
                    </table>
                </div>
            </div>

            <div class="pageControl"></div>
        </div>
    </div>

</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="footer" runat="Server">
    <script src="../assets/js/jquery-ui-1.10.4.min.js"></script>
    <script src="../assets/img/validate/learunui-validator.js"></script>
    <script src="../assets/js/page/pageControl.js"></script>
    <script src="../assets/js/page/rScroll.js"></script>
    <script src="../assets/js/page/tableControl.js"></script>
    <script src="../assets/js/plugins/webuploader/webuploader.min.js"></script>
    <script src="../assets/js/framework.js"></script>
    <script src="../assets/js/plugins/bootstrap-typeahead/bootstrap-typeahead.js"></script>
    <script src="../assets/js/plugins/iCheck/icheck.min.js"></script>
    <script src="../assets/js/plugins/iCheck/icheckAll.js"></script>
    <script src="../assets/js/plugins/stepper/stepper.widget.js"></script>
    <script src="../assets/js/plugins/boxdrop/jquery.boxdrop.js"></script>
    <script src="../assets/js/jquery-rowcol-span.min.js"></script>
    <script src="../assets/js/plugins/bootstrap-duallistbox/jquery.bootstrap-duallistbox.min.js"></script>
    <script>
        $('document').ready(function () {
            var materialID;
            //模块ID
            var ModuleID = Y.getUrlParam("ModuleID");
            //当前页数
            var page = 1;
            //获取按钮
            commonUtil.loadBtnList(ModuleID, function () {
                $('#editBtn').attr("disabled", "disabled");
                rScroll();
            });

            var dataList = [];
            IsCreate = true;
            //处理表头
            if ($('.footable thead').children().size() == 0) {
                tableControl.initThead('.footable',
                    [
                        {
                            trClass: '',
                            children: [
                                { tdText: '', c: 0, r: 0, tdHtml: '<input type="checkbox" id="checkAllPlan" />', tdId: '', tdClass: 'diy-td-w30' },
                                { tdText: '货号', c: 0, r: 0, tdHtml: '', tdId: '', tdClass: 'diy-td-w100' },
                                { tdText: '所有店铺限制', c: 0, r: 0, tdHtml: '', tdId: '', tdClass: 'diy-td-w150' },
                                { tdText: '店铺', c: 0, r: 0, tdHtml: '', tdId: '', tdClass: 'diy-td-w150' }
                            ]
                        }
                    ]);
            }
            //将中文替换掉
            $('#MaterialID').bind('input propertychange', function () {
                var myReg = /^[\u4e00-\u9fa5]+$/;
                if (myReg.test($(this).val())) {
                    $(this).val("");
                }
                //将中文替换掉
                $(this).val($(this).val().replace(/[^\x00-\xff]/g, ''));
            });

            var pageList = [];
            //获取列表
            var loadList = function () {
                $('#editBtn').attr('disabled', 'disabled');
                shopCode = '';
                materialID = '';
                sizeID = '';
                pageControl.init('MatSuppleShop', 'GetMatSuppleShoplist', {
                    keys: $('#search-store').val().trim().replace(/'/g, ''),
                    materialId: $('#search_materialID').val(),
                    Page: page,
                    Size: 50,
                    needLayer: true,
                    alwaysCallBack: function () {
                        $('#pageList').empty();
                    }
                }, function (result) {
                    pageList = [];
                    page = result.page;
                    var tBody = [];
                    if (!Y.checkNull(result.data)) {
                        if (result.data.Items.length > 0) {
                            //有值，可以编辑  在选择后控制
                            //$('#editBtn').removeAttr('disabled');
                            dataList = result.data.Items;
                            var IsEmpty = '0';
                            result.data.Items.map(function (items, i) {
                                //pageList.push(item);
                                items.map(function (item, j) {
                                    var tempChild = [];
                                    if (j == 0) {
                                        tempChild = [
                                            {
                                                tdText: '',
                                                c: 0,
                                                r: items.length,
                                                tdHtml:
                                                '<input type="checkbox" class="checkPlan" data-index="' + i + '" /><span style="display:none">' +
                                                (item.MaterialID || IsEmpty) + '</span>',
                                                tdId: '',
                                                tdClass: 'MaterialID'
                                            },
                                            {
                                                tdText: '',
                                                c: 0,
                                                r: items.length,
                                                tdHtml: '<span style="display:inline-block; width:100px;">' +
                                                (item.MaterialID || IsEmpty) + '</span>',
                                                tdId: '',
                                                tdClass: 'MaterialID'
                                            },
                                            {
                                                tdText: '',
                                                c: 0,
                                                r: items.length,
                                                tdHtml: '<span style="display:inline-block; width:100px;">' +
                                                (item.AllShopFlag === 1 ? '是' : '否' || IsEmpty) + '</span><span style="display:none"> ' +
                                                (item.MaterialID || IsEmpty) + '</span>',
                                                tdId: '',
                                                tdClass: 'AllShopFlag'
                                            },
                                            {
                                                tdText: '',
                                                c: 0,
                                                r: items.length,
                                                tdHtml: '<span style="display:inline-block; width:100px;">' +
                                                (item.CompanyID || IsEmpty) + '</span>',
                                                tdId: '',
                                                tdClass: 'hide CompanyID'
                                            },
                                            {
                                                tdText: '',
                                                c: 0,
                                                r: items.length,
                                                tdHtml: '<span style="display:inline-block; width:100px;">' +
                                                (item.ShopID || IsEmpty) + '</span>',
                                                tdId: '',
                                                tdClass: 'hide ShopID'
                                            },
                                            {
                                                tdText: '',
                                                c: 0,
                                                r: items.length,
                                                tdHtml: '<span style="display:inline-block; width:260px;">' +
                                                (item.ShopName === null ? '' : item.ShopName || IsEmpty) + '</span>',
                                                tdId: '',
                                                tdClass: 'ShopName'
                                            }
                                        ];
                                    }
                                    var tempTr = {
                                        trClass: (i % 2 == 0 ? 'gradeX footable-even' : 'gradeX footable-odd') + ' '
                                        + item.ShopID + '_'
                                        + item.MaterialID + '_',
                                        children: tempChild
                                    };
                                    tBody.push(tempTr);

                                });
                            });
                        }
                        rScroll();
                    }
                    tableControl.initTbody('.footable', (tBody.length > 0 ? tBody : null), 13, null);
                    _w_table_rowspan(".footable", 1);
                    _w_table_rowspan(".footable", 2);
                    _w_table_rowspan(".footable", 3);
                    //选择全部插件
                    $(".footable").icheckAll({
                        checkObj: ".checkPlan",//表格下面的选择控件对象 选择器
                        checkAllObj: "#checkAllPlan",//全选 选择器
                        clickoutBoxCheck: false,//点击行 不选中
                        checkboxMargin: "4px 0 0 0 "//上右下左
                    });
                });
            }
            //页面加载
            loadList();
            //选中记录样式变化
            $('#pageList').on('click', 'tr', function () {
                materialID = $(this).find('.Flag span').attr("data-MaterialID");
                $('#editBtn').removeAttr('disabled');
                $('.footable tr').removeClass('check');
                var trClass = $(this).attr("class");
                trClass = trClass.replace(/gradeX /, "");
                trClass = trClass.replace(/footable-even /, "");
                trClass = trClass.replace(/footable-odd /, "");
                trClass = '.' + trClass;
                $(trClass).addClass("check");
            });

            //查询按钮
            $('.btns-container').on('click', '#btn-search', function () {
                page = 1;
                loadList();
            });
            //删除按钮 + 列表多选
            commonUtil.initDeleteBtnEvent({
                callBack: function () {
                    submitList = [];
                    $(".footable").find('.checked').each(function () {
                        var ShopCode = $(this).parents("td").siblings(".ShopCode").text();
                        var MaterialID = $(this).parents("td").siblings(".MaterialID").text();
                        submitList.push({
                            ShopCode: ShopCode,
                            MaterialID: MaterialID,
                        });
                    });
                    if (submitList.length == 0) {
                        swal('请选择要删除的项');
                        return false;
                    }
                    Y.API2('MatSuppleShop', 'Remove',
                        {
                            List: submitList
                        }, function (data) {
                            layer.closeAll('dialog');
                            if (data.Success == false) {
                                swal('删除失败', data.Message, 'error');
                            } else {
                                swal('删除成功', '该信息已被你永久删除', 'success');
                                loadList();
                            }
                        });
                }
            });
            //导入
            $(".btns-container").on("click", '#importBtn', function () {
                $.ImportExcelTemplate({
                    filetype: 'MATSUPPLESHOP',
                    filename: '店铺补货限制',
                    action: 'ImportTemplate',
                    state: 'hasInfo',
                    after: function () {
                        //回调方法
                        loadList();
                    }
                });
            });
            //编辑按钮
            $('.btns-container').on('click', '#editBtn', function () {
                $('.editTitle').text('修改店铺补货限制');
                $('#addModuleBtn').show();
                resetInput();
                IsCreate = false;
                loadDetail();
            });            
            var resetInput = function () {
                $("#MaterialID").val("");
                $("#OldMaterialID").val("");
                $("#OldAllShopFlag").val("");
                $("#Oldselect_shop").val("");
            };
            var shopList = [], provinceList = [], cityList = [], bootstrapDualListbox;
                        //数组去重
            function removeRepEle(ar) {
                var end;//临时变量用于对比重复元素
                ar.sort();//将数重新组排序
                end = ar[0];
                for (var i = 1; i < ar.length; i++) {
                    if (ar[i] == end) {//当前元素如果和临时元素相等则将此元素从数组中删除
                        ar.splice(i, 1);
                        i--;
                    } else {
                        end = ar[i];
                    }
                }
                return ar;
            }
            var selectedShopIds, allShopFlag;
            //初始化DualListbox双选控件的数据
            function initDualListbox() {
                shopList = [];
                provinceList = [];
                Y.API2('DwShop', 'GetShopListCityModel', {}, function (data) {
                    if (data.Success == false) {
                        layer.closeAll('dialog');
                        swal(data.Message, '', 'error');
                    } else {
                        $('.select_shop').empty();
                        data.map(function (item) {
                            shopList.push(item);
                            if (item.ProvinceName != null) {
                                provinceList.push(item.ProvinceName);
                            }
                        })
                        bandingprovinceList();
                        InitbootstrapDualListbox();
                    }
                });
            }
            //获取选中行的内容,填充到打开的框内
            var loadDetail = function () {
                selectedShopIds = '';
                //有的会加载出来两个，暂时用这个代替,bug滞后处理
                var $check = $('.footable').find('.check')[0];
                var materialID = $($check).find('.MaterialID').find("span").html();
                if (materialID == "") {
                    swal("数据异常，货号不能为空，请刷新页面重试", '', 'error');
                    return false;
                }
                $('#MaterialID').val(materialID);
                $('#OldMaterialID').val(materialID);
                selectedShopIds = "";
                //加载明细
                Y.API2('MatSuppleShop', 'GetMatSuppleShopDetail', { materialId: materialID }, function (data) {
                    if (data.Success == false) {
                        layer.closeAll('dialog');
                        swal(data.Message, '', 'error');
                    } else {
                        var item = data;
                        if (item.AllShopFlag == 1) {
                            $("#AllShopFlag").val(1);
                            $("#AllShopFlag").prop('checked', true);
                        } else {
                            $("#AllShopFlag").val(0);
                            $("#AllShopFlag").prop('checked', false);
                        }
                        if (shopList.length > 0) {
                            shopList.map(function (shop_item) {
                                shop_item.Selected = false;
                            });
                        }
                        $('#OldAllShopFlag').val(item.AllShopFlag);
                        allShopFlag = item.AllShopFlag;
                        selectedShopIds = item.ShopIds;
                        $('#Oldselect_shop').val(item.ShopIds);
                    }
                    initDualListbox();
                });
            }
            //弹窗的保存操作
            $('#addModuleBtn').click(function () {
                if (!CheckDataValid('.form-edit')) {
                    return false;
                }
                var action = "";
                var successText = "";
                if (IsCreate) {
                    action = "Insert";
                    successText = '新增成功';
                }
                else {
                    action = "Update";
                    successText = '编辑成功';
                    //效验是否未更改内容
                    if (checkIsChang()) {
                        swal('数据未更改', '', 'error');
                        return false;
                    }
                }
                var _shopids = $('select[name="duallistbox_shop"]').val();
                var _materialID = $('#MaterialID').val();
                var _allShopFlag = $('#AllShopFlag').is(':checked') ? 1 : 0;
                layer.msg('玩命加载中……', { icon: 16, shade: 0.5, time: 0, maxWidth: 200 });
                Y.API2('MatSuppleShop', action, {
                    MaterialID: _materialID,
                    AllShopFlag: _allShopFlag,
                    ShopIds: encodeURI(_shopids)
                }, function (data) {
                    layer.closeAll('dialog');
                    if (data.Success == false) {
                        swal(data.Message, '', 'error');
                    } else {
                        swal(successText, '', 'success');
                        //关闭新建  or 编辑框  
                        $('#closeAddBox').click();
                        //刷新列表
                        loadList();
                    }
                });
            });
            //修改时 验证是否有修改内容
            var checkIsChang = function () {
                var _newShopIds = $('select[name="duallistbox_shop"]').val();
                var _OldShopIds = $('#Oldselect_shop').val();

                var _newAllShopFlag = $('#AllShopFlag').is(':checked') ? 1 : 0;
                var _OldAllShopFlag = $('#OldAllShopFlag').val();

                if (_newShopIds == _OldShopIds && _newAllShopFlag == _OldAllShopFlag)
                    return true;
                return false;
            }
            //绑定省            
            function bandingprovinceList() {
                $('#serarch-province').empty();
                $('#serarch-province').append('<option value="">请选择省份</option>');
                $('#serarch-city').empty();
                $('#serarch-city').append('<option value="">请选择城市</option>');
                removeRepEle(provinceList);
                provinceList.map(function (provinceName) {
                    $('#serarch-province').append('<option value="' + provinceName + '">' + provinceName + '</option>');
                });
            }
            //省份变更事件
            $('#serarch-province').change(function () {
                $('#serarch-city').empty();
                $('#serarch-city').append('<option value="">请选择城市</option>');
                cityList = [];
                var provinceName = $('#serarch-province').val();
                shopList.map(function (item) {
                    if (item.ProvinceName == provinceName) {
                        cityList.push(item.CityName);
                    }
                });
                removeRepEle(cityList);
                cityList.map(function (cityName) {
                    $('#serarch-city').append('<option value="' + cityName + '">' + cityName + '</option>');
                    $('#serarch-city').val('');
                    return false;
                });
                InitbootstrapDualListbox();
            });
            //地市变更事件
            $('#serarch-city').change(function () {
                InitbootstrapDualListbox();
            });
            //所有店铺限制补货变更事件
            $('#AllShopFlag').change(function () {
                disabledSelectControl();
            });
            //禁用或启用编辑窗口的控件
            function disabledSelectControl() {
                var value = $('#AllShopFlag').is(':checked');
                if (value) {
                    $('.form-edit select').attr("disabled", "disabled");
                    $('.form-edit .filter').attr("disabled", "disabled");
                    $('.form-edit .btn').attr("disabled", "disabled");
                } else {
                    $('.form-edit select').removeAttr('disabled');
                    $('.form-edit .filter').removeAttr('disabled');
                    $('.form-edit .btn').removeAttr('disabled');
                }
            }
            //设置双选控件的默认选择项
            function setShopListSelected() {
                //当前选中值
                var t_ShopIDs = $('[name="duallistbox_shop"]').val();
                if (t_ShopIDs != null) {
                    var shopIDs = t_ShopIDs.splice(',');
                    shopIDs.map(function (id) {
                        shopList.map(function (shop_item) {
                            if (shop_item.ShopID == id) {
                                shop_item.Selected = true;
                            }
                        });
                    });
                }
            }
            //初始化双选控件
            function InitbootstrapDualListbox() {
                //初始值
                if (selectedShopIds != "") {
                    var _selecteds = selectedShopIds.split(',');
                    _selecteds.map(function (c) {
                        for (var i = 0; i < shopList.length; i++) {
                            var d = shopList[i];
                            if (d.ShopID === c) {
                                d.Selected = true;
                            }
                        }
                    });
                }
                setShopListSelected();
                $('select[name="duallistbox_shop"]').empty();
                $('.select_shop').empty();
                var _provinceName = $('#serarch-province').val();
                var _cityName = $('#serarch-city').val();
                if (_provinceName == "" && _cityName == "") {
                    shopList.map(function (shop_item) {
                        createShopItem(shop_item);
                    });
                } else {
                    shopList.map(function (shop_item) {
                        if (shop_item.Selected) {
                            createShopItem(shop_item);
                        } else {
                            if (_cityName != "") {
                                if (shop_item.ProvinceName == _provinceName && shop_item.CityName == _cityName) {
                                    createShopItem(shop_item);
                                }
                            } else {
                                if (shop_item.ProvinceName == _provinceName) {
                                    createShopItem(shop_item);
                                }
                            }
                        }
                    });
                }
                if (bootstrapDualListbox == null) {
                    bootstrapDualListbox = $('select[name="duallistbox_shop"]').bootstrapDualListbox();
                }
                bootstrapDualListbox.bootstrapDualListbox('refresh');
                disabledSelectControl();

            }
            //增加店铺项
            function createShopItem(shop_item) {
                if (shop_item.Selected) {
                    $('.select_shop').append('<option value="' + shop_item.ShopID + '" Selected="Selected">' + shop_item.ShopName + '</option>');
                } else {
                    $('.select_shop').append('<option value="' + shop_item.ShopID + '">' + shop_item.ShopName + '</option>');
                }
            }
        });
    </script>
</asp:Content>
